<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=1000, initial-scale=1.0, maximum-scale=1.0">
	    <!-- Loading Bootstrap -->
	    <link href="public/admin/Flat/dist/css/vendor/bootstrap.min.css" rel="stylesheet">
	    <!-- Loading Flat UI -->
	    <link href="public/admin/Flat/dist/css/flat-ui.css" rel="stylesheet">
	    <link href="public/admin/Flat/docs/assets/css/demo.css" rel="stylesheet">
	    <link rel="shortcut icon" href="public/admin/Flat/img/favicon.ico">
	    	 <!--引入框架的cssjs组件-->
	    	<link rel="stylesheet" href="resource/hdjs/css/bootstrap.min.css">
		<script src="resource/hdjs/js/angular.min.js"></script>
	
		<link href="resource/hdjs/css/bootstrap.min.css" rel="stylesheet">
		<link href="resource/hdjs/css/font-awesome.min.css" rel="stylesheet">
		<script src="resource/hdjs/js/jquery.min.js"></script>
		<script src="resource/hdjs/app/util.js"></script>
		<script src="resource/hdjs/require.js"></script>
		<script src="resource/hdjs/app/config.js"></script>
	    <!--引入框架组件结束-->
	    
	    
	    <!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. -->
	    <!--[if lt IE 9]>
	      <script src="dist/js/vendor/html5shiv.js"></script>
	      <script src="dist/js/vendor/respond.min.js"></script>
	    <![endif]-->
	</head>
	<body>
		<div class="alert alert-success">添加文章</div>
		<div class="form-group">
			<form action="" method="post" id="form" onsubmit="return add();">
			
			<label for="exampleInputEmail1">文章标题</label>
			<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入文章名称" required="" name="title">
		</div>
		<div class="form-group">
			<label for="exampleInputEmail1">作者</label>
			<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入作者名称" required="" name="author" value="">
		</div>
		<div class="form-group">
			<label for="exampleInputEmail1">所属分类</label>
			<select name="category_cid" class="form-control">
				<option value="0">请选择</option>
				<foreach from="$cateData" key="$k" value="$v">
					<!--为何要写value值因为是select提交到数据库中-->
					<option value="{{$v['cid']}}">{{$v['_cname']}}</option>
					
				</foreach>
				
			</select>
		</div>
		<!--上传图片的组件-->
		<div class="form-group">
			    <div class="input-group">
			        <input type="text" class="form-control" name="thumb" readonly="" value="">
			        <div class="input-group-btn">
			            <button onclick="upImage(this)" class="btn btn-default" type="button">选择图片</button>
			        </div>
			    </div>
			    <div class="input-group" style="margin-top:5px;">
			         <img src="resource/images/nopic.jpg" class="img-responsive img-thumbnail" width="150">
			        <em class="close" style="position:absolute; top: 0px; right: -14px;" title="删除这张图片" onclick="removeImg(this)">×</em>
			    </div>
		</div>
		<!--上传图片组件结束-->
		
		
		<div id="">
			<label for="">文章标签</label>
			<br />
			<foreach from="$tagData" key="$k" value="$v";">
			<label class="checkbox checkbox-inline">
				<input id="checkbox1" class="custom-checkbox" name='tid[]' type="checkbox" data-toggle="checkbox" checked="checked" value="{{$v['tid']}}">
				<span class="icons">
				<span class="icon-unchecked"></span>
				<span class="icon-checked"></span>
				</span>
				{{$v['tname']}}
			</label>
			</foreach>
		</div>
		<div class="form-group">
			<label for="exampleInputEmail1">文章摘要</label>
			<textarea name="digest" rows="5" cols=""  class="form-control" placeholder="请输入文章关键字"></textarea>
		</div>
		<div class="form-group">
			<label for="exampleInputEmail1">文章关键字</label>
			<textarea name="keywords" rows="5" cols=""  class="form-control" placeholder="请输入文章关键字"></textarea>
		</div>
		<div class="form-group">
			<label for="exampleInputEmail1">文章描述</label>
			<textarea name="des" rows="5" cols=""  class="form-control" placeholder="请输入文章描述"></textarea>
		</div>
		<div class="form-group">
			<label for="exampleInputEmail1">文章正文</label>
			<textarea name="content" rows="5" cols=""  class="form-control" placeholder="请输入文章正文"></textarea>
		</div>
		<button class="btn btn-primary btn-block" type="submit"> 确定 </button>
		</form>
	<!--上传图片的js-->	
<script>
//上传图片
function upImage(obj) {
    require(['util'], function (util) {
      options = {
          multiple: false,//是否允许多图上传
          data:'',
          hash:1
          //hash为确定上传文件标识（可以以用户编号，标识为此用户上传的文件，系统使用这个字段值来显示文件列表），data为数据表中的data字段值，开发者根据业务需要自行添加
      };
      util.image(function (images) {             //上传成功的图片，数组类型 
          $("[name='thumb']").val(images[0]);
          $(".img-thumbnail").attr('src', images[0]);
      }, options)
    });
}

//移除图片 
function removeImg(obj) {
    $(obj).prev('img').attr('src', 'resource/images/nopic.jpg');
    $(obj).parent().prev().find('input').val('');
}
</script>
	<!--上传图片js结束-->
	<script type="text/javascript">
	//		$.post()//jsajax的快速配置的发送方法
//		1.请求地址，2.发送的数据，3.发送成功后的回调函数，success::function(),4.返回的数据类型
//		$.post("{{U('add')}}",data,function(phpData){},'json');		
//		发送ajax的函数
		function add(){
			//序列化后成字符串因为ajax发送的数据json是字符串类型的数据
			var data=$('#form').serialize();
//			alert(data);
			$.post("{{U('add')}}",data,function(phpData){
//				alert(phpData);
//				因为要使用util对象中的提示框方法所以这里需要载入
				require(['util'],function(util){
//						util.message函数可以弹出模态框，并且输出错误消息
					if(phpData.valid){
	util.message(phpData.message,"{{U('index')}}",'success');
	
        }else{
	            util.message(phpData.message,'','error');
         }						
				});
				
			},'json');
			return false;
			
		}
	</script>	
	
	
	
	
	</body>
</html>
